import type { RouteRecordRaw } from 'vue-router'
import { markRaw } from 'vue'
import { CoreCaptchaIcon } from '@/components/CoreIcon'

const exampleRoutes: RouteRecordRaw = {
  path: '/example',
  redirect: '/example/table',
  meta: {
    title: 'example.example',
    icon: '#svg-example'
  },
  children: [
    {
      path: '/example/captcha',
      redirect: '/example/captcha/slide',
      children: [
        {
          path: '/example/captcha/slide',
          component: () => import('@/views/example/captcha/slide/index.vue'),
          meta: {
            title: 'example.slide-verify'
          }
        },
        {
          path: '/example/captcha/rotate',
          component: () => import('@/views/example/captcha/rotate/index.vue'),
          meta: {
            title: 'example.rotate-verify'
          }
        },
        {
          path: '/example/captcha/point-selection',
          component: () =>
            import('@/views/example/captcha/point-selection/index.vue'),
          meta: {
            title: 'example.point-selection'
          }
        }
      ],
      meta: {
        title: 'example.captcha',
        icon: markRaw(CoreCaptchaIcon)
      }
    },
    {
      path: '/example/pin-input',
      component: () => import('@/views/example/pin-input/index.vue'),
      meta: {
        title: 'example.pin-input',
        icon: 'icon-pin-input'
      }
    }
  ]
}

export default exampleRoutes
